<style lang="scss" scoped>
    @import '../../css/training.scss';
    @import '../../css/exam2.scss';
    .hide{display: none;}
    .active{color: $mco;border-bottom:3px solid #3F66F6;}

    /*编辑问卷状态下----编辑问卷*/
    .text-input-a{width: 100%;height: 48px;border: 1px solid $mc3;background: #fff;text-align: center;line-height: 48px;box-sizing: border-box;}
    .editor-limit-txt{color:$mc3;right: 20px;bottom:30px;}

    .naire-bottom-dealr{ height:42px;line-height: 42px;}
    /*编辑状态下生成问卷---*/
    .naire-creat-des{border-top:1px  solid #e1e7eb;border-bottom: 1px  solid #e1e7eb;padding:20px 0px;width: 100%;color:$mc2;font-size: 14px;line-height: 30px;}
    .text-input-b{width: 100%;height:50px;background: #fff;text-align: center;line-height: 50px;border:none;}
    .public-btn-icon{top: 38px;right:0px;position: absolute;margin-left: 20px;}

    /*添加按钮*/
    .question-types-btn{cursor: pointer;}
    .deal-btn{cursor: pointer;}

    /*题目循环*/
    .ques-tit{font-size: 14px;color:red;}
    .edit-icon{width: 40px; height: 40px; float: right; cursor: pointer; background: #f7f8fa url('http://jhsy-img.caizhu.com/sass/images/icon-edit.png') no-repeat center center;}
    .save-icon{width: 40px; height: 40px; float: right; cursor: pointer; background: #f7f8fa url('http://jhsy-img.caizhu.com/sass/images/save-ic.png') no-repeat center center;}
    /*展示状态下*/
    /*编辑状态下*/
    .btn-cancel{background: $mc3;color:#fff;}
    .choose-btn{width: 410px; text-align: center; border: $mcbd dashed 1px; color: $mc2; line-height: 40px; cursor: pointer;}
    .limit-num{color:$mc2;font-size: 14px;}

    .show-exam-title{width: 70%;}

    .grey-check{ background-color: #edf2fc; border-color: #d8dce5; cursor: not-allowed;}
    .grey-txt{color: #b4bccc;cursor: not-allowed}

</style>

<style>
    .limit-input .el-input{width: 50px;height:42px;}
    .from-topic .el-button--small{padding: 0px;}
    .QNR-topic-input-box .el-input{width: 316px;}
    .QNR-bank-input-box .el-input{width: 316px;}
    .table-box .el-table th,.table-box .el-table td{text-align: center;}
</style>

<template>
    <section>

        <section class="breadcrumb-box clearfix">
            <el-breadcrumb separator=" > " class="fl">
                <el-breadcrumb-item >培训</el-breadcrumb-item>
                <el-breadcrumb-item :to="{path: '/training/training-manage'}">培训管理</el-breadcrumb-item>
                <el-breadcrumb-item v-if="$route.meta">{{$route.meta.title}}</el-breadcrumb-item>
            </el-breadcrumb>
        </section>

        <section class="questionnaire-box mt">
            <section class="train-name">
                <span>《{{TrainName}}》问卷</span>
               <!-- <el-input v-model="QNRForm.TrainName" placeholder="请输入培训名称"></el-input>  -->
            </section>

            <section class="traniing-info-tab exam-info-tab p-relative">
                <span v-for="item,$index in tabList" :class="{'active': tabIndex ==$index}" @click="tabActive($index)">{{item}}</span>
                <div class="p-absolute exam-info-tabr" :class="spaceQNRFlag == false?'':'hide'">
                    <span class="mr20" @click="toQNRFormPreview">预览</span>
                    <template v-if="!submitFlag">
                        <span class="ml from-bank" @click="chooseQNRQuestions">+  从题库选题</span>
                    </template>
                    <!--<span class="ml from-bank" @click="questionListFlag = true">+  从题库选题</span>-->
                </div>
            </section>


            <section class="naire-main-content">

                <section v-if="spaceQNRFlag == true" class="exam-space">
                    <span class="exam-space-item space-iconf" @click="setNewQuestionnaire">
                        <img src="http://jhsy-img.caizhu.com/sass/images/Training-ic-paper.png" alt="">
                        <span class="space-txt fs-14 mt">新建空白问卷</span>
                    </span>
                    <div class="exam-space-item" @click="questionnaireChoose = true">
                        <img src="http://jhsy-img.caizhu.com/sass/images/Training-ic-Test-paper.png" alt="">
                        <span class="space-txt fs-14 mt">问卷库中选择</span>
                    </div>
                </section>

                <section v-if="spaceQNRFlag == false">
                    <section v-if="step==0">
                        <el-form  :model="QNRForm" :rules="QNRrules" ref="QNRForm" >
                            <div  class="mt20">   <!--:class="{'hide':!paperFlag}"-->
                                <section >    <!--v-if="!QNRCreate" -->

                                    <!--问卷编辑状态-->
                                    <el-form-item label="问卷名称" prop="ExamTitle">
                                        <el-input placeholder="请输入问卷名称" v-if="QNRCreate == false" v-model="QNRForm.ExamTitle"></el-input>
                                        <el-input placeholder="请输入问卷名称" v-if="QNRCreate == true" v-model="QNRForm.ExamTitle" :disabled="QNRTitle.paperFlag == false" @focus="QNRTitleFocus"></el-input>
                                        <template v-if="QNRCreate == true">     <!-- v-if="paperFlag == true" -->
                                            <span class="edit-icon" v-if="QNRTitle.paperFlag == false" @click="QNRTitle.paperFlag=true"></span>
                                            <span class="save-icon" v-if="QNRTitle.paperFlag == true" @click="doSaveQNRTitle"></span>
                                        </template>
                                    </el-form-item>
                                    <el-form-item label="问卷描述" prop="ExamDesc">
                                        <el-input placeholder="请输入问卷描述" v-if="QNRCreate == false" v-model="QNRForm.ExamDesc"></el-input>
                                        <el-input placeholder="请输入问卷描述" v-if="QNRCreate == true" v-model="QNRForm.ExamDesc" :disabled="QNRDes.paperFlag == false"  @focus="QNRDesFocus"></el-input>
                                        <template v-if="QNRCreate == true">    <!-- v-if="paperFlag == true" -->
                                            <span class="edit-icon" v-if="QNRDes.paperFlag == false" @click="QNRDes.paperFlag=true"></span>
                                            <span class="save-icon" v-if="QNRDes.paperFlag == true" @click="doSaveQNRDes"></span>
                                        </template>
                                    </el-form-item>



                                    <section class="mt40 naire-bottom-deal">

                                        <div class="exam-addbox mt20">
                                            <span class="exama-one exama-i0" @click="addOne(2)">单选题</span>
                                            <span class="exama-one exama-i1" @click="addOne(1)">多选题</span>
                                            <span class="exama-one exama-i2" @click="addOne(3)">问答题</span>
                                        </div>

                                        <template v-for="outer,index in QNRForm.Questions">
                                        <!-- 单选题+多选题 -->
                                        <section :class="{hide:outer.editFlag}">  <!-- 显示 -->
                                            <div class="exam-one clearfix mt20" v-if="outer.QuestionType!=3">
                                                <div class="examo-lef">
                                                    <div class="">Q{{index+1}}</div>
                                                    <div class="examo-do examo-edit mt" @click="editOne(index)"></div>
                                                    <template v-if="!existExamQNRID">
                                                        <div class="examo-do examo-del" @click="delOne(index,outer.QuestionType)"></div>
                                                    </template>
                                                    <template v-if="existExamQNRID">
                                                        <template v-if="QNRForm.Questions.length > 1">
                                                            <div class="examo-do examo-del" @click="delEditOne(index,outer)"></div>
                                                        </template>

                                                    </template>
                                                </div>
                                                <div class="examo-rig">
                                                    <!-- 标题 -->
                                                    <div class="examo-tit examo-line clearfix">
                                                        <div class="examo-f01 show-exam-title">
                                                            <span v-if="outer.QuestionType==1">【多选题】</span>
                                                            <span v-else>【单选题】</span>

                                                            <span class="">{{outer.QuestionTitle}}</span>
                                                            <!--<span class="ml20" v-if="outer.IsNeed == 1">【必答】</span>-->
                                                        </div>
                                                    </div>
                                                    <!-- 选项 -->
                                                    <div class="examo-one examo-line mt20 clearfix" v-for="one,iIndex in outer.Answers">
                                                        <div class="examo-f00">
                                                            <el-radio :label="iIndex" v-if="outer.QuestionType==2" disabled>{{answerArr[iIndex]}}</el-radio>
                                                            <label v-else disabeld>
                                                                <span class="exam-checkbox grey-check"></span>
                                                                <span class="grey-txt">{{answerArr[iIndex]}}</span>
                                                            </label>
                                                            <span>{{one.AnswerValue}}</span>
                                                        </div>
                                                    </div>

                                                    <div v-if="outer.QuestionType == 1 " class="mt20 limit-input">
                                                        <template v-if="outer.LimitAnswerNum>0">
                                                            <el-checkbox  v-model="limitChecked" disabled>限制最多选择数</el-checkbox>
                                                        </template>
                                                        <template v-else>
                                                            <el-checkbox disabled>限制最多选择数</el-checkbox>
                                                        </template>
                                                        <span class="limit-num ml20" >最多可选</span>
                                                        <el-input v-model="outer.LimitAnswerNum" disabled></el-input>
                                                        <span class="limit-num">项</span>
                                                    </div>

                                                </div>
                                            </div>
                                            <!-- 问答题 -->
                                            <div class="exam-one clearfix mt20" v-else>
                                                <div class="examo-lef">
                                                    <div class="">Q{{index+1}}</div>
                                                    <div class="examo-do examo-edit mt" @click="editOne(index)"></div>
                                                    <template v-if="!existExamQNRID">
                                                        <div class="examo-do examo-del" @click="delOne(index,outer.QuestionType)"></div>
                                                    </template>
                                                    <template v-if="existExamQNRID">
                                                        <template v-if="QNRForm.Questions.length > 1">
                                                            <div class="examo-do examo-del" @click="delEditOne(index,outer)"></div>
                                                        </template>
                                                    </template>
                                                </div>
                                                <div class="examo-rig">

                                                    <div class="examo-one examo-line clearfix">
                                                        <div class="examo-f00 show-exam-title">
                                                            <span>【问答题】</span>
                                                            <!--<el-input class="examo-inp00" placeholder="标题"></el-input>-->
                                                            {{outer.QuestionTitle}}
                                                            <!--<span class="ml20" v-if="outer.IsNeed == 1">【必答】</span>-->
                                                        </div>
                                                        <div class="examo-f02">
                                                            <span>{{outer.RightScore}}</span>
                                                        </div>
                                                    </div>
                                                    <div class="mt20">
                                            <span v-if="outer.Answers.length == 0">
                                                 <!--<el-input type="textarea" :rows="5" placeholder="请输入问答答案..."></el-input>-->
                                            </span>
                                                <!--<span v-if="outer.Answers.length > 0">
                                                    <el-input type="textarea" :rows="5" placeholder="请输入问答答案..."></el-input>
                                                </span> -->
                                                        <!--<el-input type="textarea" :rows="5" placeholder="请输入问答答案...">
                                                        </el-input>-->
                                                    </div>
                                                </div>
                                            </div>

                                        </section>

                                        <section :class="{hide:!outer.editFlag}">   <!-- 编辑 -->
                                            <div class="exam-one clearfix mt20" v-if="outer.QuestionType!=3">
                                                <div class="examo-lef">
                                                    <div class="">Q{{index+1}}</div>
                                                    <!--<div class="examo-do examo-edit mt"></div>-->
                                                    <template v-if="!existExamQNRID">
                                                        <div class="examo-do examo-del mt20" @click="delEdit(index)"></div>
                                                    </template>
                                                    <template v-if="existExamQNRID">
                                                        <template v-if="QNRForm.Questions.length > 1">
                                                            <template v-if="editOldQNRTopic">
                                                                <template v-if="!createNewQNRTopic">
                                                                    <div class="examo-do examo-del" @click="delEditTwo(index,outer)"></div>
                                                                </template>
                                                            </template>
                                                            <template v-if="!editOldQNRTopic">
                                                                <template v-if="createNewQNRTopic">
                                                                    <div class="examo-do examo-del" @click="delEditThree(index,outer)"></div>
                                                                </template>
                                                            </template>
                                                        </template>
                                                    </template>
                                                </div>
                                                <div class="examo-rig">
                                                    <!-- 标题 -->
                                                    <div class="examo-tit clearfix">
                                                        <div class="examo-f00">
                                                            <el-input class="examo-inp00" placeholder="标题" v-model="outer.QuestionTitle"></el-input>
                                                        </div>
                                                        <div class="examo-f01">
                                                            <span v-if="outer.QuestionType==1">【多选题】</span>
                                                            <span v-else>【单选题】</span>
                                                        </div> <!--编辑状态-->
                                                        <!--<div class="examo-f01">-->
                                                            <!--<template v-if="!existExamQNRID">-->
                                                                <!--<el-checkbox v-model="outer.isSingleNeed" @change="isNeedChange(index)">-->
                                                                    <!--【必答】-->
                                                                <!--</el-checkbox>-->
                                                            <!--</template>-->
                                                            <!--<template v-if="existExamQNRID">-->
                                                                <!--<el-checkbox v-model="outer.isSingleNeed" @change="isNeedChange(index)">-->
                                                                    <!--【必答】-->
                                                                <!--</el-checkbox>-->
                                                            <!--</template>-->
                                                        <!--</div>-->
                                                    </div>
                                                    <!-- 选项 -->
                                                    <div class="examo-one mt20 clearfix" v-for="one,iIndex in outer.Answers">
                                                        <div class="examo-f00">

                                                            <!--<span v-if="outer.QuestionType==2"><el-radio disabled="true"></el-radio></span>
                                                            <span v-else><el-checkbox disabled></el-checkbox></span>-->
                                                            <el-radio v-model="outer.RightAnswerIDs" :label="iIndex" v-if="outer.QuestionType==2" disabled>{{answerArr[iIndex]}}</el-radio>
                                                            <label v-else>
                                                                <span class="exam-checkbox"></span>
                                                                <span>{{answerArr[iIndex]}}</span>
                                                            </label>

                                                            <el-input class="examo-inp02 ml" placeholder="标题" v-model="one.AnswerValue"></el-input>

                                                        </div>

                                                        <div class="examo-f02">
                                                            <span class="examo-do examo-tot" :class="{'hide':firstIndex == iIndex}" @click="switchUp(one,iIndex,outer.Answers,outer)"></span>
                                                            <span class="examo-do examo-tob" :class="{'hide': outer.Answers.length-1 == iIndex}" @click="switchDown(one,iIndex,outer.Answers,outer)"></span>
                                                            <span class="examo-do examo-del" @click="delAnswerOne(index,iIndex)"></span>  <!--删除选项-->
                                                        </div>
                                                    </div>

                                                    <div class="examo-add mt20" @click="addAnswerOne(index)">+添加选项</div>

                                                        <template v-if="!existExamQNRID">

                                                            <div v-if="outer.QuestionType == 1 " class="mt20 limit-input">
                                                                <el-checkbox  v-model="outer.EditlimitChecked" @change="limitCheckedChange(index)">限制最多选择数</el-checkbox>
                                                                <span class="limit-num ml20" >最多可选</span>
                                                                <el-input v-model="outer.LimitAnswerNum" @blur="limitBlur(index)" :disabled="!outer.EditlimitChecked"></el-input>
                                                                <span class="limit-num">项</span>
                                                            </div>
                                                        </template>
                                                        <template v-if="existExamQNRID">

                                                            <div v-if="outer.QuestionType == 1 " class="mt20 limit-input">
                                                                <el-checkbox  v-model="outer.EditlimitChecked" @change="limitCheckedChange(index)">限制最多选择数</el-checkbox>
                                                                <span class="limit-num ml20" >最多可选</span>
                                                                <el-input v-model="outer.LimitAnswerNum" @blur="limitBlur(index)" :disabled="!outer.EditlimitChecked"></el-input>
                                                                <span class="limit-num">项</span>
                                                            </div>
                                                        </template>

                                                        <template v-if="!existExamQNRID">
                                                            <div class="examo-save mt20" @click="saveAnswerOne(index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                            <div class="examo-cancel mt20 ml" @click="cancelAnswerOne(index)" v-if="cancelOneFlag">取消</div>
                                                        </template>
                                                        <template v-if="existExamQNRID">
                                                            <template v-if="!editOldQNRTopic">
                                                                <template v-if="createNewQNRTopic">
                                                                    <div class="examo-save mt20" @click="saveEditNewAnswerOne(outer,index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                                    <div class="examo-cancel mt20 ml" @click="cancelEditNewAnswerOne(index)" v-if="cancelOneFlag">取消</div>

                                                                    <!--<div class="examo-cancel mt20 ml" @click="cancelAnswerOne(index)" v-if="cancelOneFlag">取消</div>-->
                                                                </template>
                                                            </template>
                                                            <template v-if="editOldQNRTopic">
                                                                <template v-if="!createNewQNRTopic">
                                                                    <div class="examo-save mt20" @click="saveEditOldAnswerOne(outer,index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                                    <div class="examo-cancel mt20 ml" @click="holdOldOne(index,outer.QuestionType)" v-if="cancelOneFlag">取消</div>
                                                                    <!--<div class="examo-cancel mt20 ml" @click="holdOldOne(index)" v-if="cancelOneFlag">取消</div>-->
                                                                </template>
                                                            </template>
                                                        </template>
                                                </div>
                                            </div>
                                            <!-- 问答题 -->
                                            <div class="exam-one clearfix mt20" v-else>
                                                <div class="examo-lef">
                                                    <div class="">Q{{index+1}}</div>
                                                    <!--<div></div>-->
                                                    <template v-if="!existExamQNRID">
                                                        <div class="examo-do examo-del mt20" @click="delEdit(index)"></div>
                                                    </template>
                                                    <template v-if="existExamQNRID">
                                                        <template v-if="QNRForm.Questions.length > 1">
                                                            <template v-if="editOldQNRTopic">
                                                                <template v-if="!createNewQNRTopic">
                                                                    <div class="examo-do examo-del" @click="delEditTwo(index,outer)"></div>
                                                                </template>
                                                            </template>
                                                            <template v-if="!editOldQNRTopic">
                                                                <template v-if="createNewQNRTopic">
                                                                    <div class="examo-do examo-del" @click="delEditThree(index,outer)"></div>
                                                                </template>
                                                            </template>
                                                        </template>
                                                    </template>
                                                </div>
                                                <div class="examo-rig">

                                                    <div class="examo-one clearfix">
                                                        <div class="examo-f00">
                                                            <el-input class="examo-inp00" placeholder="标题" v-model="outer.QuestionTitle"></el-input>
                                                        </div>
                                                        <div class="examo-f01">
                                                            <span>【问答题】</span>
                                                        </div>
                                                        <!--<div class="examo-f01">-->
                                                            <!--<template v-if="!existExamQNRID">-->
                                                                <!--<el-checkbox v-model="outer.isSingleNeed" @change="isNeedChange(index)">-->
                                                                    <!--【必答】-->
                                                                <!--</el-checkbox>-->
                                                            <!--</template>-->
                                                            <!--<template v-if="existExamQNRID">-->
                                                                <!--<el-checkbox v-model="outer.isSingleNeed" @change="isNeedChange(index)">-->
                                                                    <!--【必答】-->
                                                                <!--</el-checkbox>-->
                                                            <!--</template>-->
                                                        <!--</div>-->
                                                    </div>
                                                    <div class="mt20">
                                                        <!-- <el-input type="textarea" :rows="5" placeholder="请输入问答答案..." v-model="outer.Answers[0].AnswerValue">
                                                         </el-input>-->

                                                        <!--<el-input type="textarea" :rows="5" placeholder="请输入问答答案...">
                                                        </el-input> -->
                                                    </div>
                                                    <template v-if="!existExamQNRID">
                                                        <div class="examo-save mt20" @click="saveAnswerOne(index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                        <div class="examo-cancel mt20 ml" @click="cancelAnswerOne(index)" v-if="cancelOneFlag">取消</div>
                                                    </template>
                                                    <template v-if="existExamQNRID">
                                                        <template v-if="!editOldQNRTopic">
                                                            <template v-if="createNewQNRTopic">
                                                                <div class="examo-save mt20" @click="saveEditNewAnswerOne(outer,index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                                <div class="examo-cancel mt20 ml" @click="cancelEditNewAnswerOne(index)" v-if="cancelOneFlag">取消</div>

                                                                <!--<div class="examo-cancel mt20 ml" @click="cancelAnswerOne(index)" v-if="cancelOneFlag">取消</div>-->
                                                            </template>
                                                        </template>
                                                        <template v-if="editOldQNRTopic">
                                                            <template v-if="!createNewQNRTopic">
                                                                <div class="examo-save mt20" @click="saveEditOldAnswerOne(outer,index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                                <div class="examo-cancel mt20 ml" @click="holdOldOne(index,outer.QuestionType)" v-if="cancelOneFlag">取消</div>
                                                                <!--<div class="examo-cancel mt20 ml" @click="holdOldOne(index)" v-if="cancelOneFlag">取消</div>-->
                                                            </template>
                                                        </template>
                                                    </template>
                                                </div>
                                            </div>
                                        </section>

                                    </template>

                                        <!--添加选择题-->
                                        <div class="exam-addbox mt20" :class="{hide:!QNRForm.Questions.length}">
                                            <span class="exama-add mr"></span>
                                            <template v-if="addBtnFlag">
                                                <span class="exama-one exama-tip" @mouseover="addOver">添加题目</span>
                                            </template>
                                            <template v-else>
                                                <div class="exama-dos" @mouseout="outAddBtn" @mousemove="moveAddBtn">
                                                    <span class="exama-one exama-i0" @click="addOne(2,true)">单选题</span>
                                                    <span class="exama-one exama-i1" @click="addOne(1,true)">多选题</span>
                                                    <span class="exama-one exama-i2" @click="addOne(3,true)">问答题</span>
                                                </div>
                                            </template>
                                        </div>

                                        <!--生成问卷-->
                                        <!--<section class="mt40" style="width: 100%;text-align: center;">
                                            <el-button class="btn-active btn-or" @click="toBecomeQuestionnaire">生成问卷</el-button>
                                        </section>-->

                                        <template v-if="!existExamQNRID">
                                            <div class="exama-minor mt20" :class="{'hide':!addFlag}">
                                                <el-checkbox v-model="QNRForm.isJoinExamLib" true-label="1" value="1">将问卷保存到问卷库</el-checkbox>
                                                <el-checkbox v-model="QNRForm.isJoinQuestionLib" true-label="1" value="1">将题目保存到问卷题库</el-checkbox>
                                            </div>
                                            <div class="mt20" v-show="paperIsApply==false">
                                                <template v-if="!submitFlag">
                                                    <el-button type="primary" @click="submitForm('QNRForm')">生成问卷</el-button>
                                                </template>
                                            </div>
                                        </template>

                                    </section>
                                </section>
                            </div>
                        </el-form>


                    <section v-if="step==1">

                    </section>


                    <section v-if="step==2">

                    </section>

                </section>

            </section>

        </section>

            <!--从问卷库中选择问卷-->
            <el-dialog
                title="问卷选择"
                :visible.sync="questionnaireChoose"
                width="50%"
                center>
            <section class="signup-total QNR-bank-input-box">
                <!--<el-input
                        placeholder="请输入问卷名称"
                        prefix-icon="el-icon-search"
                        v-model="libQNRKeyword"
                        class="sign-input"
                        @change="QNRChange">
                </el-input>-->
                <el-input placeholder="请输入问卷名称" v-model="libQNRKeyword" class="input-with-select">
                    <el-button slot="append" icon="el-icon-search" @click="QNRChange()"></el-button>
                </el-input>
            </section>
            <section class="table-box mt">
                <el-table :data="libQRNList" height="500">
                    <el-table-column property="ExamTitle" label="问卷名称" style="text-align: center;"></el-table-column>
                    <el-table-column property="QuestionNum" label="问卷题目数"></el-table-column>
                    <el-table-column property="CreateTime" label="创建时间"></el-table-column>
                    <el-table-column label="操作">
                        <template slot-scope="one">
                            <el-button type="text" size="small" @click="libQRNApplay(one.row)">应用</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </section>
                <section class="mt20 clearfix">
                    <section class="fr">
                        <el-pagination
                                @size-change="getQNRLibList"
                                @current-change="getQNRLibList"
                                :page-size="pageLibQRNInfo.pageSize"
                                layout="prev, pager, next, jumper"
                                :total="pageLibQRNInfo.total">
                        </el-pagination>
                    </section>
                </section>
           <!-- <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="questionnaireChoose = false">知道了</el-button>
            </span>-->
        </el-dialog>


            <el-dialog
                    title="题库选择"
                    :visible.sync="questionListFlag"
                    width="50%"
                    center>
                <section class="signup-total QNR-topic-input-box">
                    <!--<el-input
                            placeholder="请输入题目内容"
                            prefix-icon="el-icon-search"
                            v-model="questionKeyword"
                            debounce="200"
                            @change="questionChange"
                            class="sign-input">
                    </el-input>-->
                    <el-input placeholder="请输入题目内容" v-model="questionKeyword" class="input-with-select">
                        <el-button slot="append" icon="el-icon-search" @click="questionChange()"></el-button>
                    </el-input>
                </section>
                <section class="table-box mt from-topic">
                    <el-table :data="questionList" height="500" >
                        <el-table-column property="QuestionTitle" label="题目"></el-table-column>
                        <el-table-column label="类型">
                            <template slot-scope="one">
                                {{one.row.QuestionType | filterType}}
                            </template>
                        </el-table-column>
                        <el-table-column label="操作">
                            <template slot-scope="scope">
                                <el-button type="text" size="small" @click="questionApply(scope.row.QID)" class="mr20">应用</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </section>
                <section class="mt20 clearfix">
                    <section class="fr">
                        <el-pagination
                                @size-change="getQNRQuestionList"
                                @current-change="getQNRQuestionList"
                                :page-size="pageQuestionInfo.pageSize"
                                layout="prev, pager, next, jumper"
                                :total="pageQuestionInfo.total">
                        </el-pagination>
                    </section>
                </section>
                <!--<span slot="footer" class="dialog-footer">
                    <el-button type="primary" @click="questionListFlag = false">确定</el-button>
                </span>-->
            </el-dialog>

    </section>

    </section>
</template>

<script>

	import qs from 'qs'
	import editor from '../../components/wangeditor.vue'
	import com from 'js/common'
	let answerArr = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'G', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];

	Vue.filter('filterType', n=>{
		var arr = ['', '多选题', '单选题', '问答题'];
		return arr[n];
	});

	export default{
		data: function(){
			return {
				tabIndex: 0,
				tabList:['编辑问卷','发放问卷','问卷结果'],
				questionnaireType: 0,//问卷tab切换

                initHasNaire: false,

                step:0,

				showTopicTypesBtn: false,
				showTopicSingleBtn: true,
				checked1: true,
				checked2: false,
				QNRCreate:false,
				editText:false,
                naireName:'',
                newNaireName:'',
				questionnaire:{
				    theme:''
                },
				questionnaireChoose: false,
				libQNRKeyword: '',
				libQRNList:[],

				pageLibQRNInfo:{
					page:1,
					pageSize:20,
                },
				paperFlag: '',

                initHasQsn: '',

				spaceQNRFlag: '',

                paperFlag: '',

                qsnQuestionFlag: '',
                qsnChoiceFlag: '',

				answerArr: answerArr,

				QNRForm:{
					Questions:[

					],
				},

				QNRrules:{
					ExamTitle: [
						{ required: true, message: '请输入问卷名称', trigger: 'blur' }
					],
					ExamDesc: [
						{ required: true, message: '请输入问卷描述', trigger: 'blur' }
					],
                },

                QNRTitle:{
					paperFlag: false,
                },
				QNRDes:{
					paperFlag: false,
                },

                QNRExamLibID:'',
				hasExamId: false,

				editFlag: false,
				editTip: '请先完成问卷的编辑！',

				cancelOneFlag: false,
				addBtnFlag: true,

				outTimeId: '',

				contentList:[],
				firstIndex: 0,

				limitChecked: true,


				questionListFlag: false,
				questionList:[],
				pageQuestionInfo: {
					pageSize: 20,
					page:1
				},
				questionKeyword:'',

				existExamQNRID : false,

				TrainName:'',
				submitFlag: false,

				editOldQNRTopic: false,
				createNewQNRTopic : false,

                paperIsApply:false

            }
		},
		computed: {
			hasExamId: function(){
				console.log('mdmd');
				this.QNRForm.ExamQNRID = this.$router.query.ExamQNRID;
				if( this.QNRForm.ExamQNRID > 0){
					return true;
				}
				return false;
			},
			addFlag: function(){      // 是添加还是编辑
				if(this.QNRForm.ExamQNRID > 0){
					return false;
				}
				return true;
			}
		},
		mixins: [mixinMethods],
		methods: {

			questionChange: function(){
				this.getQNRQuestionList();
			},
			QNRChange(){
				this.getQNRLibList();
            },

			getTrainName(){
				let TrainID = this.$route.query.TrainID;
				axios.post('/com/train/get', qs.stringify({
					trainID: TrainID
				})).then( (res) => {
					var d = res.data;
					if(d.flag == 1){
						this.TrainName = d.data.TrainName;
					}else{
						this.$message.error(d.msg);
					}
				} )
			},
			HasQSN(){
				let self =this;
				let ExamQNRID = self.$route.query.ExamQNRID;

				if(ExamQNRID == undefined){
					localStorage.getItem("QNRformInfo");
					let form = localStorage.getItem("QNRformInfo");
					if(form){
						self.spaceQNRFlag = false;
						let form1 = JSON.parse(form);
						self.QNRForm =form1.form;
						self.step = 0;
						self.existExamQNRID = false;
						self.submitFlag = false;
						self.initHasQsn = 0;
					}else{
						self.step = 0;
						self.initHasQsn = 0;
						self.spaceQNRFlag = true;
						self.existExamQNRID = false;
						self.submitFlag = false;
					}
				}else if(ExamQNRID == 0){
					localStorage.getItem("QNRformInfo");
					let form = localStorage.getItem("QNRformInfo");
					if(form){
						self.spaceQNRFlag = false;
						let form1 = JSON.parse(form);
						self.QNRForm =form1.form;
						self.step = 0;
						self.existExamQNRID = false;
						self.submitFlag = false;
						self.initHasQsn = 0;
					}else{
						self.initHasQsn = 0;
						self.step = 0;
						self.spaceQNRFlag = true;
						self.existExamQNRID = false;
						self.submitFlag = false;
                    }
				}else if(ExamQNRID > 0){
					self.initHasQsn = true;
					self.step = 0;
					self.spaceQNRFlag = false;
                    self.QNRCreate = true;
					self.QNRTitle.paperFlag = false;
					self.QNRForm.paperFlag = false;
                    self.existExamQNRID = true;
                    self.submitFlag = true;
                    self.editFlag = false;
                    self.initHasTest = true;


					self.getTrainQNRInfo(ExamQNRID);
//                    self.getQNRbankInfo(ExamQNRID);


					return true;
				}else{
					return false;
				}
			},

			tabActive(i){

				if(!this.initHasTest){
					this.$message.error(this.editTip);
					this.addBtnFlag = true;
					return ;
				}else if(this.initHasTest){
					this.editFlag = false;
                }

				let self = this;
				self.tabIndex = i;
				self.step = i;

				let TrainID = this.$route.query.TrainID;
                let ExamQNRID = this.$route.query.ExamQNRID;

				if(this.step == 1){
					location.assign('/training/push-QNR'+'?ExamQNRID='+ExamQNRID + '&TrainID=' + TrainID);

				}else if(this.step == 2){
					location.assign('/training/QNR-result'+'?ExamQNRID='+ExamQNRID  + '&TrainID=' + TrainID);
				}

			},
			setNewQuestionnaire(){
				let self = this;
				self.spaceQNRFlag = false;
				self.step = 0;
				self.paperFlag = true;
            },
            actionBtn(){
				let self = this;
				self.showTopicTypesBtn = true;
				self.showTopicSingleBtn = false;
			},
			offBtn(){
				let self = this;
				self.showTopicTypesBtn = false;
				self.showTopicSingleBtn = true;
			},
			toBecomeQuestionnaire(){
				this.$refs.QNRForm.validate((valid) => {
                    if (valid) {
                        alert('编辑成功!');
						this.QNRCreate = true;
                    } else {
                    	this.$message.error('请填写完整再进行操作哦');
                        return false;
                    }
                });

            },
			editTextIcon(){
				this.editText = true;
            },
			editTextIconSave(){
				this.editText = false;
				this.naireName = this.newNaireName;
            },
			doDelete(){
				this.$confirm('删除数据不可恢复，请再次确认是否要删除。', '您确定要删除该问题吗？', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning',
					center: true
				}).then(() => {
					this.$message({
						type: 'success',
						message: '删除成功!'
					});
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
            },

			getQNRLibList(page){
				this.pageLibQRNInfo.page=page || 1 ;
				axios.post('/com/exam/getQNRLibList', qs.stringify({
					pagesize:this.pageLibQRNInfo.pageSize,
					page:this.pageLibQRNInfo.page,
					keywords: this.libQNRKeyword,

                })).then( (res) => {
					var d = res.data;
					console.log(d);
					if(d.flag == 1){
						//console.log(d);
						this.libQRNList = d.data.Rows;
						//console.log('问卷库列表');
						//console.log(this.libQRNList);
						this.pageLibQRNInfo.total = d.data.Total;

					}else{
						this.$message.error(d.msg);
					}
				} );
            },

			libQRNApplay(a){
                let self = this;
                let ExamLibID = a.ExamLibID;
                this.QNRForm.ExamLibID = ExamLibID;
                this.QNRExamLibID = a.ExamLibID;

                this.getOne(ExamLibID);


            },


            getQNRbankInfo(id){
                let self = this;
                let ExamLibID = id;

				axios.post('/com/exam/getQNRLib', qs.stringify({
					examLibID: ExamLibID,
                })).then( (res) => {
                    var d = res.data;

//					var d = resObj;
					this.questionnaireChoose = false;
					this.spaceQNRFlag = false;
                    console.log(d);

                    if(d.flag == 1){

						d.Questions.forEach(function(one){
							one.editFlag = false;
						});
                        this.QNRForm = d.data;

						self.paperFlag = false;
                    }else{
                    	alert(2);
                        this.$message.error(d.msg);
                    }
                } );

            },

			getOne(id){
				axios.post('/com/exam/getQNRLib', qs.stringify({
					examLibID: id
				})).then( (res)=>{
					var d = res.data;

					this.questionnaireChoose = false;
					this.editFlag = false;
					this.spaceQNRFlag = false;

					if(d.flag == 1){
						d = d.data;

						d.Questions.forEach(function(one){
							one.editFlag = false;
                            if(one.LimitAnswerNum == 0){
                            	one.limitChecked = false;
                            	one.EditlimitChecked = false;
                            	one.LimitAnswerNum = '';
                            }else if(one.LimitAnswerNum > 0){
								one.limitChecked = true;
								one.EditlimitChecked = true;
                            }
						});

						//this.editFlag = true;
						this.QNRForm = d;


						console.log(d);
						this.QNRForm.ExamQNRID = id;
                        //直接生成问卷
                        let TrainID = this.$route.query.TrainID;
                        this.QNRForm["TrainID"] = TrainID;
                        axios.post('/com/train/applyLibExam', qs.stringify(
                            {
                                trainID: TrainID,
                                infoType: 2,
                                examLibID:id
                            }
                        )).then( (res)=>{
                            var d = res.data;
                            if(d.flag == 1){
//							this.form.ExamID = parseInt(d.data.ExamID);

                                this.paperIsApply = true;

                                this.hasExamId = true;
                                this.mainEditFlag = false;
                                this.editFlag = false;
                                this.initHasTest = true;
                                this.$message.success('应用成功');
                                this.submitFlag = true;
                                location.assign('/training/questionnaire?ExamQNRID='+parseInt(d.data.ExamID)+'&TrainID='+TrainID);
                            }else{
                                this.submitFlag = false;
                                this.$message.error(d.msg);
                            }
                        } );
//						this.step = 2;
					}
				} );
			},


			judgeCheckOn: function(index, arr){

//                if(!arr){
//					return false;
//                }
                console.log(index);
                console.log(arr);
				if(arr.indexOf(index) > -1){
					return true;
				}
				return false;
			},

            getTrainQNRInfo(id){
				axios.post('/com/exam/getQNR', qs.stringify({
					/*ExamLibID:id,*/
					examID: id,
				})).then( (res) => {
					var d = res.data;
					this.editFlag = false;

					if(d.flag == 1){
						console.log('获取培训问卷详情');
						d.data.Questions.forEach(function(item){
							item.editFlag = false;
//
							if(item.QuestionType == 1){
								if(item.LimitAnswerNum > 0){
									item.limitChecked = true;
									item.EditlimitChecked = true;

								}else if(item.LimitAnswerNum == 0){
									item.limitChecked = false;
									item.EditlimitChecked = false;
									item.LimitAnswerNum = '';
								}
							}
							if(item.IsNeed == "1"){
								item.isSingleNeed = true;
							}else if(item.IsNeed == "0"){
								item.isSingleNeed = false;
							}
						});
						if(d.data.Editable == 1){
							this.showButton = true;
						}else if(d.data.Editable == 0){
							this.showButton = false;
						}

						this.QNRForm = d.data;
						this.QNRForm.ExamID = id;
						this.step = 0;

					}else{
						this.$message.error(d.msg);
					}
				} );

            },

			doSaveQNRTitle(){
				let ExamID1 = this.$route.query.ExamQNRID;
                let ExamID2 = this.QNRExamLibID;
                if(ExamID1 > 0){
					axios.post('/com/exam/editQNR', qs.stringify({
						examID: ExamID1,
						examTitle: this.QNRForm.ExamTitle,
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							this.$message.success('编辑成功');
							this.QNRTitle.paperFlag = false;
						}else{
							this.QNRTitle.paperFlag = false;
							this.$message.error(d.msg);
						}
					} );

                }else if(ExamID1 == 0){
                    if(ExamID2 > 0){
						axios.post('/com/exam/editQNR', qs.stringify({
							examID: ExamID2,
							examTitle: this.QNRForm.ExamTitle,
						})).then( (res) => {
							var d = res.data;
							if(d.flag == 1){
								this.$message.success('编辑成功');
								this.QNRTitle.paperFlag = false;
							}else{
								this.QNRTitle.paperFlag = false;
								this.$message.error(d.msg);
							}
						} );
                    }else if(ExamID2 <=0){
                        this.$message.error('没有问卷');
                    }

                }

            },

			doSaveQNRDes(){

				let ExamID1 = this.$route.query.ExamQNRID;
				let ExamID2 = this.QNRExamLibID;



				if(ExamID1 > 0){
					axios.post('/com/exam/editQNR', qs.stringify({
						examID: ExamID1,
						examDesc: this.QNRForm.ExamDesc,
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							this.$message.success('编辑成功');
							this.QNRDes.paperFlag = false;
						}else{
							this.QNRDes.paperFlag = false;
							this.$message.error(d.msg);
						}
					} );

				}else if(ExamID1 == 0){
					if(ExamID2 > 0){
						axios.post('/com/exam/editQNR', qs.stringify({
							examID: ExamID2,
							examDesc: this.QNRForm.ExamDesc,
						})).then( (res) => {
							var d = res.data;
							if(d.flag == 1){
								this.$message.success('编辑成功');
								this.QNRDes.paperFlag = false;
							}else{
								this.QNRDes.paperFlag = false;
								this.$message.error(d.msg);
							}
						} );
					}else if(ExamID2 <=0){
						this.$message.error('没有问卷id');
					}

				}

            },

			QNRTitleFocus(){
				this.QNRTitle.paperFlag = true;
			},
			QNRDesFocus(){
				this.QNRDes.paperFlag = true;
            },

			addEventRadio(a,flag){
                let self = this;
                if(flag){
                	self.addBtnFlag = true;
                }
                let type = a;

				self.qsnQuestionFlag = true;
				self.qsnChoiceFlag = true;

            },

			submitForm: function(formName){
				if(this.editFlag){
					this.$message.error(this.editTip);
					return ;
				};

				this.$refs[formName].validate((valid) => {
					if (valid) {
						this.doAxios();
					} else {
						return false;
					}
				});
			},

			doAxios: function(){

				var questions = this.QNRForm.Questions;


				questions = com.toArray(questions);
				questions.forEach( (one)=>{
					for(var iOne, i=0,len=one.Answers.length; i<len; i++){
						iOne = one.Answers[i];
						iOne.AnswerKey = answerArr[i];
					}
				} )
				questions = null;
				let TrainID = this.$route.query.TrainID;
				this.QNRForm["TrainID"] = TrainID;

				axios.post('/com/exam/addQNR', qs.stringify(
					this.QNRForm,
				)).then( (res)=>{
					var d = res.data;
					if(d.flag == 1){
						this.QNRForm.ExamQNRID = parseInt(d.data.id);
						this.hasExamId = true;
//						this.mainEditFlag = false;

						this.QNRTitle.paperFlag = false;
						this.QNRDes.paperFlag = false;

						this.editFlag = false;
						this.initHasTest = true;
						this.$message.success('上传成功');
						location.assign('/training/questionnaire?ExamQNRID='+ parseInt(d.data.id)+'&TrainID='+TrainID);
					}
				} );
			},
			addOne: function(n, type){
                let self = this;
				if(self.editFlag){
					self.$message.error(self.editTip);
					return ;
				}

				if(this.existExamQNRID){
					self.editOldQNRTopic = false;
					self.createNewQNRTopic = true;
					self.cancelOneFlag = true;
					self.editFlag = true;
					if(type){
						self.editOldQNRTopic = false;
						self.createNewQNRTopic = true;
						self.cancelOneFlag = true;
						self.editFlag = true;
					}
					stepTwo();
                }else if(!this.existExamQNRID){
					self.cancelOneFlag = true;
					self.editFlag = true;
					if(type){
						self.cancelOneFlag = true;
						self.addBtnFlag = true;
					}
					stepOne();
                }

				function stepTwo(){
					var obj;
// RightAnswerIndexs
					if(n==1){
						obj = {QuestionTitle: '',ExamQID: '0',isSingleNeed: true,EditlimitChecked: false,limitChecked: false,LimitAnswerNum: '',IsNeed:'1',
							Answers: [
								{},
								{},
                                {},
                                {}
							]
						}
					}else if(n == 3){
						obj = {AnswerValue: '',ExamQID: '0',isSingleNeed: true,IsNeed:'1',
							Answers: [
								{},
								{}
							]
						}
					}else if(n == 2){
						obj = {QuestionTitle: '',isSingleNeed: true,ExamQID: '0',IsNeed:'1',
							Answers: [
								{},
								{},
                                {},
                                {}
							]
						}
                    }
					stepThree(obj);
				}

				function stepOne(){
					var obj;
// RightAnswerIndexs
					if(n==1){
						obj = {QuestionTitle: '',isSingleNeed: true,EditlimitChecked: false,limitChecked: false,
							Answers: [
								{},
								{},
                                {},
                                {}
							]
						}
					}else if(n == 3){
						obj = {AnswerValue: '',isSingleNeed: true,
							Answers: [
								{},
								{}
							]
						}
					}else if(n == 2){
						obj = {QuestionTitle: '',isSingleNeed: true,
							Answers: [
								{},
								{},
                                {},
                                {}
							]
						}
                    }
					stepThree(obj);
				}

				function stepThree(obj){
					if(n == 1){ // 单选
						obj.QuestionType = 1;
						//obj.RightAnswerIndexs = [];
					}else if(n == 2){ // 多选
						obj.QuestionType = 2;
						//obj.RightAnswerIndexs = '';
					}else if(n == 3){ // 问答
						obj.QuestionType = 3;
					}

					obj.editFlag = true;

					self.QNRForm.Questions.push(obj);
				}
			},

			addAnswerOne: function(index){
				var one = this.QNRForm.Questions[index];


				if(one){
					one.Answers.push({});
				}


			},

			saveAnswerOne: function(outerIndex, type){
				let outer = this.QNRForm.Questions[outerIndex];
				this.isNeedChange(outerIndex);
				var status = this.judgeQNROkOne(outerIndex, type),
					flag = status.flag;
				if(flag){
					this.QNRForm.Questions[outerIndex].editFlag = false;
					this.editFlag = false;
					this.cancelOneFlag = false;
					if(outer.LimitAnswerNum > 0){
						outer.limitChecked = true;
					}
				}else{
					this.$message.error(status.msg);
				}
			},


			delEdit(outerIndex){

				this.$confirm('确认删除？').then(()=>{
					this.editFlag = false;
					this.QNRForm.Questions.splice(outerIndex, 1);
				}).catch( ()=>{
					//
				})

			},

			addOver: function(){
				this.addBtnFlag = false
			},

			outAddBtn: function(){
				clearTimeout(this.outTimeId);
				this.outTimeId = setTimeout(()=>{
					this.addBtnFlag = true;
				}, 600);
			},
			moveAddBtn: function(){
				clearTimeout(this.outTimeId);
			},

			holdOldOne(index,type){
				let ExamQNRID = this.$route.query.ExamQNRID;
				axios.post('/com/exam/getQNR', qs.stringify({
					examID:ExamQNRID
				})).then( (res) => {
					var d = res.data;
					if(d.flag == 1){
						this.QNRForm.Questions[index].QuestionTitle =  d.data.Questions[index].QuestionTitle;
						this.QNRForm.Questions[index].QuestionType =  d.data.Questions[index].QuestionType;
						if(type == 1){
							this.QNRForm.Questions[index].LimitAnswerNum =  d.data.Questions[index].LimitAnswerNum;
                        }
						this.QNRForm.Questions[index].QuestionTitle =  d.data.Questions[index].QuestionTitle;
						this.QNRForm.Questions[index].ExamQID =  d.data.Questions[index].ExamQID;
						this.QNRForm.Questions[index].IsNeed =  d.data.Questions[index].IsNeed;
						this.QNRForm.Questions[index].Answers =  d.data.Questions[index].Answers;
						this.editFlag = false;
						this.QNRForm.Questions[index].editFlag = false;
					}else{
						this.$message.error(d.msg);
					}
				} );
			},

			cancelAnswerOne: function(outerIndex){
				this.editFlag = false;
				this.QNRForm.Questions.splice(outerIndex, 1);


			},

			editOne : function(index){
				if(this.editFlag){
					this.$message(this.editTip);
					return ;
				}

				this.cancelOneFlag = true;
				this.QNRForm.Questions[index].editFlag = true;
				this.editFlag = true;
				this.QNRForm.Questions[index].editFlag = true;

				if(this.existExamQNRID){
					this.editOldQNRTopic = true;
					this.createNewQNRTopic = false;
					let extend = this.QNRForm.Questions[index];
					if(extend.QuestionType == 1){
						if(extend.LimitAnswerNum >0){
							extend.EditlimitChecked = true;
							extend.limitChecked = true;
						}else{
							extend.EditlimitChecked = false;
							extend.limitChecked = false;
							extend.LimitAnswerNum = "";
						}
					}
                }

			},

			delOne: function(index){
				if(this.editFlag){
					this.$message(this.editTip);
					return ;
				}

				this.$confirm('确认删除？').then(()=>{
					this.QNRForm.Questions.splice(index, 1);


				}).catch( ()=>{
					//
				})

			},

			delAnswerOne: function(outerIndex, index){
				var one = this.QNRForm.Questions[outerIndex];
				if(one){
					one.Answers = Array.prototype.slice.call(one.Answers, 0);
					one.Answers.splice(index, 1);
				}


			},

			switchUp(one,index,list,outer){
				let self = this;
				self.contentList = list;
				self.contentList.splice(index,1);
				self.contentList.splice(index-1,0,one);
				let itemNewLast = self.contentList[index-1].answersOne;
				let itemNewNext = self.contentList[index].answersOne;
				one.answersOne = itemNewNext;
				self.contentList[index].answersOne = itemNewLast;


			},

			switchDown(one,index,list,outer){
				let self = this;
				self.contentList = list;
				self.contentList.splice(index,1);
				self.contentList.splice(index+1,0,one);
				let itemNewLast = self.contentList[index].answersOne;
				let itemNewNext = self.contentList[index+1].answersOne;
				one.answersOne = itemNewLast;
				self.contentList[index].answersOne = itemNewNext;

			},

			toQNRFormPreview(){
				let ExamQNRID = this.$route.query.ExamQNRID;
				if(ExamQNRID > 0){
					location.assign('/training/QNR-preview' +'?ExamQNRID='+ ExamQNRID);
				}else{
					localStorage.setItem("QNRformInfo",JSON.stringify({
						"form":this.QNRForm,
					}));
					location.assign('/training/QNR-preview');
				}

			},

			chooseQNRQuestions(){
                let self = this;
				self.questionListFlag = true;
                self.getQNRQuestionList();

            },

			getQNRQuestionList(page){
				this.pageQuestionInfo.page=page || 1 ;
//				this.questionLoading = true;
				axios.post('/com/exam/getQNRLibQuestionList', qs.stringify({
					pageSize:this.pageQuestionInfo.pageSize,
					page: this.pageQuestionInfo.page,
					keywords: this.questionKeyword
				})).then((res) => {
					var d = res.data;
					this.questionLoading = false;
					if(d.flag == 1){
						this.questionList = d.data.Rows;
						this.pageQuestionInfo.total=d.data.Total;
					}else {
						this.$message.error(d.msg)
					}
				})

			},

			questionApply(id){
				if(this.editFlag){
					this.$message.error(this.editTip);
					return ;
				}

				/*
                this.questionListFlag = false;
                //one.editFlag = false;
                this.form.Questions.push(one);*/

				let arr = [];
				this.QNRForm.Questions.forEach((item)=>{
					arr.push(item.QID);
				});
				if(arr.indexOf(id) > -1){
					this.$message.error('该问卷中已经存在该问题，请重新选择其它问题！');
				}else{
					this.getQuestionOne(id);
				}

			},

			getQuestionOne: function(id){
				axios.post('/com/exam/getQNRQuestion', qs.stringify({
					QID: id,
					isApply: 1,
				})).then( (res)=>{
					var d = res.data;

					this.libListFlag = false;
					this.editFlag = false;

					if(d.flag == 1){
						d = d.data;
						this.questionListFlag = false;

						if(d.QuestionType == 1){
							if(d.LimitAnswerNum > 0){
								d.limitChecked = true;
							}
                        }

						d.editFlag = false;
						this.QNRForm.Questions.push(d);
					}
				} );
			},

			isNeedChange(outerIndex){
				let outer = this.QNRForm.Questions[outerIndex];
				if(outer.QuestionType == 1){
					one();
				}else if(outer.QuestionType == 2){
					one();
				}else if(outer.QuestionType == 3){
					one();
				}
				function one(){
					if(outer.isSingleNeed){
						outer.IsNeed = 1;
					}else if(!outer.isSingleNeed){
						outer.IsNeed = 0;
					}
				}
            },

			limitCheckedChange(outerIndex){
				let aa = this.QNRForm.Questions[outerIndex];
				if(aa.EditlimitChecked){
					if(aa.LimitAnswerNum > 0){
						if(aa.LimitAnswerNum <= aa.Answers.length){

						}else{
							this.$message.error('最多可选项必须小于答案选项总数');

						}
					}else{
//						this.$message.error('请输入最多可选项');
					}
				}else{
					aa.LimitAnswerNum = "";
				}
			},

			limitBlur(outerIndex){
				let bb = this.QNRForm.Questions[outerIndex];
				if(bb.EditlimitChecked){
					if(bb.LimitAnswerNum>0){
						if(bb.LimitAnswerNum <= bb.Answers.length){

						}else{
							this.$message.error('最多可选项必须小于答案选项总数');

						}
					}else{
						this.$message.error('请输入最多可选项');
					}
				}else{
					bb.LimitAnswerNum = "";
				}
			},

			saveEditNewAnswerOne(item,outerIndex, type){
				let self =this;
				var status = this.judgeQNROkOne(outerIndex, type),
					flag = status.flag;
				if(flag){
					self.getAllTopicId();
					self.doSendNewTopic(item,outerIndex);
				}else{
					this.$message.error(status.msg);
				}
            },

			getAllTopicId(){
				let self =this;
				let oldArr = [];
				self.QNRForm.Questions.forEach((one)=>{
					oldArr.push(Number(one.ExamQID));
				});
				let arr = oldArr;
				let str= arr.join(",");
				self.examQIDs = str;

			},

			judgeQNROkOne(outerIndex,type){

				let outer = this.QNRForm.Questions[outerIndex];
				let one = outer,
					answers = one.Answers,
					len = answers.length,
					status = {flag: true, msg: ''};
				if(!answers){
					return false;
				}

				if(type == 3){
					if(!one.QuestionTitle) return {flag: false, msg: '请输入标题'};
				}else{
					if(!one.QuestionTitle) return {flag: false, msg: '请输入标题'};
					for(var i= 0; i<len; i++){
						if(!answers[i].AnswerValue){
							return {flag: false, msg: '请输入问题描述'};
						}
					}
				}
				if(type == 1){
					if(outer.EditlimitChecked){
						if(outer.LimitAnswerNum>0){
							if(outer.LimitAnswerNum <= outer.Answers.length){

							}else{
								return {flag: false, msg: '最多可选项必须小于答案选项总数'};

							}
						}else if(outer.LimitAnswerNum == '0'){
							return {flag: false, msg: '最多可选项不能为0'};
						}else if(!outer.LimitAnswerNum){
							return {flag: false, msg: '请输入最多可选项'};
						}else{
							return {flag: false, msg: '最多可选项值不能小于0'};
						}
					}else if(!outer.EditlimitChecked){
						outer.LimitAnswerNum = "";
					}
				}
				return status;

			},

			doSendNewTopic(item,outerIndex){
				let self =this;
				let ExamQNRID= this.$route.query.ExamQNRID;

				if(item.QuestionType == 2){

					axios.post('/com/exam/editQNR', qs.stringify({
						examID: ExamQNRID,
						examQIDs: self.ExamQIDs,
						question: {
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							Answers:  item.Answers,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							self.$message.success('编辑成功');
                            this.HasQSN()
							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;

							self.editOldQNRTopic = false; // 未修改
							self.createNewQNRTopic = false; // 未新增

						}else{
							self.$message.error(d.msg);
						}
					} );

				}else if(item.QuestionType == 1){
					axios.post('/com/exam/editQNR', qs.stringify({
						examID: ExamQNRID,
						examQIDs: self.ExamQIDs,
						question: {
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							LimitAnswerNum : item.LimitAnswerNum,
							Answers:  item.Answers,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							self.$message.success('编辑成功');
                            this.HasQSN()
							if(item.LimitAnswerNum > 0){
								item.limitChecked = true;
							}else{
								item.limitChecked = false;
							}

							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;
							self.editOldQNRTopic = false; // 未修改
							self.createNewQNRTopic = false; // 未新增

						}else{
							self.$message.error(d.msg);
						}
					} );

				}else if(item.QuestionType == 3){
					axios.post('/com/exam/editQNR', qs.stringify({
						examID: ExamQNRID,
						examQIDs: self.ExamQIDs,
						question: {
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							Answers:  item.Answers
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							self.$message.success('编辑成功');
                            this.HasQSN()
							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;
							self.editOldQNRTopic = false; // 未修改
							self.createNewQNRTopic = false; // 未新增

						}else{
							self.$message.error(d.msg);
						}
					} );
				}
            },

			cancelEditNewAnswerOne(outerIndex){
				let self = this;
				self.editFlag = false;
				self.QNRForm.Questions.splice(outerIndex, 1);
			},

			delEditOne(index,outer){
				let self =this;
				let ExamQNRID= this.$route.query.ExamQNRID;
				self.getAllDelID(index,outer);
				axios.post('/com/exam/editQNR', qs.stringify({
					examID: ExamQNRID,
					examQIDs: self.examQIDs,
					delQID: outer.ExamQID,
				})).then( (res) => {
					var d = res.data;
					if(d.flag == 1){
//
						self.$message.success('删除成功');
						self.QNRForm.Questions.splice(index, 1);

					}else{
						self.$message.error(d.msg);
					}
				} );
			},

			getAllDelID(index,outer){
				let self = this;
				let oldArr = [];
				self.QNRForm.Questions.forEach((one)=>{
					oldArr.push(Number(one.ExamQID));
				});
				let arr = oldArr;
				arr.splice(index,1);
				let str= arr.join(",");
				self.examQIDs = str;
			},

			delEditTwo(index,outer){
				let self =this;
				let ExamQNRID= this.$route.query.ExamQNRID;
				self.getAllDelID(index,outer);
				axios.post('/com/exam/editQNR', qs.stringify({
					examID: ExamQNRID,
					examQIDs: self.examQIDs,
					delQID: outer.ExamQID,
				})).then( (res) => {

					var d = res.data;
					if(d.flag == 1){
						self.$message.success('删除成功');
						self.QNRForm.Questions.splice(index, 1);
						self.editFlag = false;

					}else{
						self.$message.error(d.msg);
					}
				} );
			},
			delEditThree(outerIndex){
				this.$confirm('确认删除？').then(()=>{
					this.editFlag = false;
					this.QNRForm.Questions.splice(outerIndex, 1);
				}).catch( ()=>{
					//
				})
            },

			saveEditOldAnswerOne(item,outerIndex, type){
				let self =this;
				var status = this.judgeQNROkOne(outerIndex, type),
					flag = status.flag;

				if(flag){
					self.getAllTopicId();
					self.doSendOldTopic(item,outerIndex);
				}else{
					this.$message.error(status.msg);
				}
			},

			getAllTopicId(){
				let self = this;
				if(self.existExamQNRID){
					let oldArr = [];
					self.QNRForm.Questions.forEach((one)=>{
						oldArr.push(Number(one.ExamQID));
					});

					let arr = oldArr;
					let str= arr.join(",");
					self.ExamQIDs = str;

				}else{
					this.$message.error('还没有试卷！快来应用一张试卷吧');
				}
			},

			doSendOldTopic(item,outerIndex){
				let self =this;
				let ExamQNRID= this.$route.query.ExamQNRID;

				if(item.QuestionType == 2){

					axios.post('/com/exam/editQNR', qs.stringify({
						examID: ExamQNRID,

						examQIDs: self.ExamQIDs,
						question: {
							ExamQID: item.ExamQID,
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							Answers:  item.Answers,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){

							self.$message.success('编辑成功');

							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;

							self.editOldQNRTopic = false;
							self.createNewQNRTopic = false;

						}else{
							self.$message.error(d.msg);
						}
					} );

				}else if(item.QuestionType == 1){
					axios.post('/com/exam/editQNR', qs.stringify({
						examID: ExamQNRID,

						examQIDs: self.ExamQIDs,
						question: {
							ExamQID: item.ExamQID,
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							LimitAnswerNum : item.LimitAnswerNum,
							Answers:  item.Answers,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){

							self.$message.success('编辑成功');

							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;
							self.editOldQNRTopic = false;
							self.createNewQNRTopic = false;

						}else{
							self.$message.error(d.msg);
						}
					} );

				}else if(item.QuestionType == 3){
					axios.post('/com/exam/editQNR', qs.stringify({
						examID: ExamQNRID,

						examQIDs: self.ExamQIDs,
						question: {
							ExamQID: item.ExamQID,
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							Answers:  item.Answers,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){

							self.$message.success('编辑成功');

							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;

							self.editOldQNRTopic = false;
							self.createNewQNRTopic = false;

						}else{
							self.$message.error(d.msg);
						}
					} );
				}
			},

			cancelAnswerOne(outerIndex){
				this.editFlag = false;
				this.QNRForm.Questions.splice(outerIndex, 1);



			},

			monitorUrl(){
				if(this.submitFlag == false){
//
					pushHistory();
					window.addEventListener("popstate", function(e) {
						localStorage.removeItem('QNRformInfo');
						window.location.assign('/training/training-manage');
					}, false);

					function pushHistory() {
						var state = {
							title: "title",
							url: ""
						};
						window.history.pushState(state, "title", "");
					}
				}
			},

		},
		mounted: function(){
//			this.spaceQNRFlag = true;

            this.getTrainName();
            this.getQNRLibList();
            this.HasQSN();

            this.monitorUrl();
		},
		components: {
			editor: editor
		}
	}


</script>